.mui-bar-nav {
	box-shadow: none;
	background-color: #FFFFFF;
	height: 45px;
}

.mui-bar .mui-btn-link {
	color: #4DE1CA;
}

.mui-bar .mui-title {
	font-size: 18px;
	font-weight: 700;
	padding: 4px 0;
	color: #3D3D3D;
}

#back-btn {
	position: fixed;
	bottom: 15px;
	left: 15px;
	width: 45px;
	z-index: 100;
}

.swiper-container {
	position: absolute;
	width: 100%;
	height: 100%;
	background-color: #FFFFFF;
}

.swiper-slide {
	text-align: center;
	padding: 20px 10px;
	width: 80%;
}

.swiper-slide img.gift-cover {
	height: 54%;
	margin: 10% auto 6% auto;
	border-radius: 5px;
	box-shadow: #C7C7CC 0 2px 4px 0;
}

.swiper-slide p.left-info {
	color: #55ACEE;
	background-color: #FFFFFF;
	border: solid 1px #FFFFFF;
	padding: 0em 0.7em 0em 1em;
	border-top-left-radius: 1em;
	border-bottom-left-radius: 1em;
	font-size: 0.65em;
	position: absolute;
	top: 9%;
	right: 4.5%;
	z-index: 20;
	opacity: 0.97;
}

.badge-list {
	margin: 1em auto 0.4em auto;
}

.badge-item {
	display: inline-block;
	width: 20%;
}

.badge-item img {
	width: 85%;
}

.badge-item p {
	font-size: 0.75em;
	font-weight: 600;
}

.badge-item .have-badge {
	color: #4DE1CA;
	
}

.swiper-slide a.get-gift {
	color: #FFFFFF;
	background-color: #FFBD43;
	border: solid 1px #FFBD43;
	padding: 0.3em 1em;
	border-radius: 1em;
	font-size: 0.8em;
}

.swiper-slide a.got-gift {
	color: #FFFFFF;
	background-color: #8F8F94;
	border: solid 1px #8F8F94;
	padding: 0.3em 1em;
	border-radius: 1em;
	font-size: 0.8em;
}

.swiper-slide a.get-no-gift {
	color: #FFFFFF;
	background-color: #8F8F94;
	border: solid 1px #8F8F94;
	padding: 0.3em 1em;
	border-radius: 1em;
	font-size: 0.8em;
}

.swiper-slide h4 {
	color: #555555;
	font-size: 0.9em;
}

#gifts .swiper-pagination {
	margin-bottom: 10px;
}

#gifts .swiper-pagination-bullet {
	background-color: #AAAAAA;
	opacity: 0.3;
}

#gifts .swiper-pagination-bullet-active {
	background: #4de1ca none repeat scroll 0 0;
	opacity: 1;
}
